<template>
  <el-button
      v-bind="props"
      icon="Plus"
      v-show="props.show"
      @click="handleAdd"
  >{{props.label}}</el-button>
</template>

<script lang="ts" setup>
import eventBus from '@/event/eventBus';
import {inject,nextTick} from "vue";
import { vFormSchemeKey,formModeKey } from '@/components/form/state.key';
import {
  executeQueryKey,resetKey,showDialogKey,insertOrUpdateFlagKey
} from "@/config/app.keys";
const formScheme = inject(vFormSchemeKey)
const formMode = inject(formModeKey)
interface Props {
  size?:string
  type?:string
  plain?:boolean
  text?:boolean
  bg?:boolean
  link?:boolean
  round?:boolean
  circle?:boolean
  loading?:boolean
  disabled?:boolean
  autofocus?:boolean
  formData?:object
  id?:string,
  label?: string,
  bindDialog:string,//绑定对话框
  dialogTitle:string,//绑定的对话框标题
  bindButton?:string,//绑定的提交按钮
  show?:boolean,//是否显示
}
const props = withDefaults(defineProps<Props>(), {
  label: '新增',
  type:"primary",
  show:true,
})
let allFormItemInDialog = []
const cMode = computed<FormFieldMode>(() => {
  if (props.mode) {
    return props.mode
  }
  if (formMode?.value) {
    return formMode.value
  }
  return "edit"
})

/**
 * 推送清空消息
 * @param allFormItemInDialog
 */
function putResetEvent(allFormItemInDialog: any[]) {
  for(let i=0;i<allFormItemInDialog.length;i++){
    eventBus.$emit(allFormItemInDialog[i].id+"_"+resetKey);
  }
}

/** 新增按钮操作 */
function handleAdd() {
  // eventBus.$emit(resetFormKey);
  //debugger;
  // 只有在 edit 模式下才执行删除操作
  if (cMode.value !== 'edit') {
    return;
  }
  console.log("formScheme"+JSON.stringify(formScheme));
  //TODO:循环对话框下所有的form-item组件，推送清空消息
  if(allFormItemInDialog.length==0){
    let dialogObj = findDialog(formScheme.value,props.bindDialog);
    if(dialogObj!=null) {
      allFormItemInDialog = buildFormIemList(dialogObj, '');
    }
  }
  putResetEvent(allFormItemInDialog)
  eventBus.$emit(props.bindDialog+"_"+showDialogKey, {show:true,title:props.dialogTitle,form:{}});
  // 使用 nextTick 确保下一个事件在 DOM 更新后触发
  if(props.bindButton){
    nextTick(() => {
      eventBus.$emit(props.bindButton+"_"+insertOrUpdateFlagKey,{flag:true,id:0})
    })
  }
}
/**
 * 构造对话框下所有组件列表
 * @param schema
 */
function buildFormIemList(schema:Object):any[] {
  //搜索所有下级：非布局，展示，按钮组件
  let i=0;
  let returnData=[];
  //debugger;
  let children =[];

  children = schema.children;

  //遍历所有子节点
  for(i=0;i<children.length;i++){
    if(children[i].category !=='layout' && children[i].category!=='display'
        && children[i].category!=='button' ){
      if(children[i].category=='form-item'){
        returnData.push({
          id: children[i].id
        })
      }else{
        let childReturnData = buildFormIemList(children[i]);
        if(childReturnData.length>0){
          returnData = returnData.concat(childReturnData)
        }
      }
    }else{
      let childReturnData = buildFormIemList(children[i]);
      if(childReturnData.length>0){
        returnData = returnData.concat(childReturnData)
      }
    }
  }
  return returnData;
}
/**
 * 根据对话框id查找对话框
 * @param schema
 * @param parentName
 */
function findDialog(schema:Object, dialogId:string):object {
  //搜索所有下级：非布局，展示，按钮组件
  let i=0;
  //遍历所有子节点
  for(i=0;i<schema.children.length;i++){
    if(schema.children[i].category !=='layout' && schema.children[i].category!=='display'
        && schema.children[i].category!=='button' ){
      if(schema.children[i].id == dialogId){
         return schema.children[i];
      }
    }else{
      let childReturnData = findDialog(schema.children[i],dialogId);
      if(childReturnData!=null){
        return childReturnData;
      }
    }
  }
  return null;
}
</script>

<style scoped>

</style>
